﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Areas/Commerce/Views/Shared/Backend.Master"
    Inherits="System.Web.Mvc.ViewPage<dynamic>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    Order
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <h3 class="title">
        Order reports</h3>
    <div class="command clearfix">
        <table class="left">
            <tbody>
                <tr>
                    <td>
                        <label>
                            Period</label>
                    </td>
                    <td>
                        <select>
                            <option>Day</option>
                            <option selected="selected">Month</option>
                            <option>Year</option>
                        </select>
                    </td>
                    <td>
                        <label>
                            From</label>
                    </td>
                    <td>
                        <input type="text" value="01/01/2010" />
                    </td>
                    <td>
                        <label>
                            To</label>
                    </td>
                    <td>
                        <input type="text" value="31/12/2010" />
                    </td>
                    <td>
                        <label>
                            Status</label>
                    </td>
                    <td>
                        <select multiple="multiple" id="status-select">
                            <option selected="selected">All</option>
                            <option selected="selected">Payment pending</option>
                            <option selected="selected">In progress</option>
                            <option selected="selected">Delivery Completed</option>
                            <option selected="selected">Delivery Return</option>
                            <option selected="selected">Drawback</option>
                            <option selected="selected">Cancel</option>
                            <option selected="selected">Alert</option>
                        </select>
                    </td>
                    <td>
                        <a class="button" href="#">Filter</a>
                    </td>
                </tr>
            </tbody>
        </table>
        <div class="dropdown-button right">
            <span>Export to</span>
            <ul class="hide">
                <li><a href="#">Excel</a></li>
                <li><a href="#">CSV</a></li>
            </ul>
        </div>
    </div>
    <div class="table-container">
        <table>
            <thead>
                <tr>
                    <th>
                        Period
                    </th>
                    <th class="numeral">
                        Orders
                    </th>
                    <th class="numeral">
                        Sales items
                    </th>
                    <th class="numeral">
                        Sales total
                    </th>
                    <th class="numeral">
                        Refunded
                    </th>
                    <th class="numeral">
                        Sales tax
                    </th>
                    <th class="numeral">
                        Sales shipping
                    </th>
                    <th class="numeral">
                        Sales discount
                    </th>
                    <th class="numeral">
                        Canceled
                    </th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>
                        09/2010
                    </td>
                    <td class="numeral">
                        10
                    </td>
                    <td class="numeral">
                        100
                    </td>
                    <td class="numeral">
                        $1,000.00
                    </td>
                    <td class="numeral">
                        $1,000.00
                    </td>
                    <td class="numeral">
                        $100.00
                    </td>
                    <td class="numeral">
                        $90.00
                    </td>
                    <td class="numeral">
                        $10.00
                    </td>
                    <td class="numeral">
                        $0.00
                    </td>
                </tr>
                <tr class="even">
                    <td>
                        11/2010
                    </td>
                    <td class="numeral">
                        10
                    </td>
                    <td class="numeral">
                        100
                    </td>
                    <td class="numeral">
                        $1,000.00
                    </td>
                    <td class="numeral">
                        $1,000.00
                    </td>
                    <td class="numeral">
                        $100.00
                    </td>
                    <td class="numeral">
                        $90.00
                    </td>
                    <td class="numeral">
                        $10.00
                    </td>
                    <td class="numeral">
                        $0.00
                    </td>
                </tr>
            </tbody>
            <tfoot>
                <tr>
                    <td>
                        Total
                    </td>
                    <td class="numeral">
                        10
                    </td>
                    <td class="numeral">
                        100
                    </td>
                    <td class="numeral">
                        $1,000.00
                    </td>
                    <td class="numeral">
                        $1,000.00
                    </td>
                    <td class="numeral">
                        $100.00
                    </td>
                    <td class="numeral">
                        $90.00
                    </td>
                    <td class="numeral">
                        $10.00
                    </td>
                    <td class="numeral">
                        $0.00
                    </td>
                </tr>
            </tfoot>
        </table>
    </div>

    	<script type="text/javascript">
    	    $(function () {
    	        // Dropdown-Button
    	        $('.dropdown-button span').click(function () {
    	            var ul = $(this).siblings('ul');
    	            if (ul.hasClass('hide')) {
    	                ul.slideDown('fast');
    	                ul.removeClass('hide');
    	                $('.dropdown-button').addClass('active');
    	            } else {
    	                ul.slideUp('fast');
    	                ul.addClass('hide');
    	                $('.dropdown-button').removeClass('active');
    	            }
    	        });
    	        $('body').click(function (evt) {
    	            if (!$(evt.target).is('.dropdown-button span')) {
    	                $('.dropdown-button ul').slideUp('fast');
    	                $('.dropdown-button ul').addClass('hide');
    	                $('.dropdown-button').removeClass('active');
    	            }
    	        });

    	        $('#status-select').dropdownchecklist({ firstItemChecksAll: true });
    	    })
	</script>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="MenuContent" runat="server">
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="WidgetContent" runat="server">
</asp:Content>
